import React, {PureComponent} from 'react';
import {Card} from 'antd';
import routes from './routes';
import {Route, Switch} from 'react-router-dom';
import HistorySelectPanel from './HistorySelectPanel';
import ApplyHistorySelectPanel from './ApplyHistorySelectPanel';
import SubHistorySelectPanel from './SubHistorySelectPanel';
import SubApplyHistorySelectPanel from './SubApplyHistorySelectPanel';
import Breadcrumb from 'Shell/components/Breadcrumb';
import qs from 'qs';
import isEmpty from 'lodash/isEmpty';

class App extends PureComponent {
    componentDidMount() {
    }
    render() {
        return (
            <div>
                <Route render={props => <Breadcrumb location={props.location}/>}/>
                <div className="page-main">
                    <Switch>
                        <Route path={routes.history.url()} exact render={props => {
                            const params = qs.parse(props.location.search.replace('?', ''));
                            return (<div>
                                <Card><HistorySelectPanel vehicleQueryParamObj={isEmpty(params) ? null : params}/></Card>
                            </div>);
                        }}/>
                        <Route path={routes.subHistory.url()} exact render={props => {
                            const params = qs.parse(props.location.search.replace('?', ''));
                            return (<div>
                                <Card><SubHistorySelectPanel vehicleQueryParamObj={isEmpty(params) ? null : params}/></Card>
                            </div>);
                        }}/>
                        <Route path={routes.applyHistory.url()} exact render={props => {
                            const params = qs.parse(props.location.search.replace('?', ''));
                            return (<div>
                                <Card><ApplyHistorySelectPanel vehicleQueryParamObj={isEmpty(params) ? null : params}/></Card>
                            </div>);
                        }}/>
                        <Route path={routes.subApplyHistory.url()} exact render={props => {
                            const params = qs.parse(props.location.search.replace('?', ''));
                            return (<div>
                                <Card><SubApplyHistorySelectPanel vehicleQueryParamObj={isEmpty(params) ? null : params}/></Card>
                            </div>);
                        }}/>
                    </Switch>
                </div>
            </div>
        );
    }
}

export default App;
